<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!--  jquery core -->
<script src="js/jquery/jquery-1.4.1.min.js" type="text/javascript"></script>

<!--  date picker script -->
<link rel="stylesheet" href="css/datePicker.css" type="text/css" />
<script src="js/jquery/date.js" type="text/javascript"></script>
<script src="js/jquery/jquery.datePicker.js" type="text/javascript"></script>

<title>Untitled Document</title>
</head>
<?php
	if(!empty($_POST)){
		echo "<pre>";
		var_dump($_POST);
		echo "</pre>";
	}
?>
<?php		
				 			
	$beginDate 		= date('d/m/Y',strtotime("-65 years"));//Lớn tuổi nhất là 65
	$endDate		= date('d/m/Y',strtotime("-15 years"));//Lớn tuổi nhất là 15					
	$current 		= getdate();
	$currentYear 	= $current['year'];
	$beginDate2 	= date('1/1/Y',strtotime($beginDate));//Chuyển về ngày 1 tháng 1 cách đây 65 năm
/*	
	echo "<br/> begin: $beginDate";
	echo "<br/> end: $endDate";
	echo "<br/> current la: ";print_r($current);
	echo "<br/> current Year: $currentYear";	
	echo "<br/> date 2 la: ".$beginDate2;
/**/
?>
<body>
<form id="chooseDateForm" action="#" method="post">
	<table border="0" cellpadding="0" cellspacing="0">
			<tr  valign="top">
				<td>
                <select name="day" id="d" class="styledselect-day">
					<option value="">Day</option>
					<option value="1">1</option>
					<option value="2">2</option>
					<option value="3">3</option>
					<option value="4">4</option>
					<option value="5">5</option>
					<option value="6">6</option>
					<option value="7">7</option>
					<option value="8">8</option>
					<option value="9">9</option>
					<option value="10">10</option>
					<option value="11">11</option>
					<option value="12">12</option>
					<option value="13">13</option>
					<option value="14">14</option>
					<option value="15">15</option>
					<option value="16">16</option>
					<option value="17">17</option>
					<option value="18">18</option>
					<option value="19">19</option>
					<option value="20">20</option>
					<option value="21">21</option>
					<option value="22">22</option>
					<option value="23">23</option>
					<option value="24">24</option>
					<option value="25">25</option>
					<option value="26">26</option>
					<option value="27">27</option>
					<option value="28">28</option>
					<option value="29">29</option>
					<option value="30">30</option>
					<option value="31">31</option>
				</select>
				</td>
				<td>
					<select name="month" id="m" class="styledselect-month">
						<option value="">Month</option>
						<option value="1">Jan</option>
						<option value="2">Feb</option>
						<option value="3">Mar</option>
						<option value="4">Apr</option>
						<option value="5">May</option>
						<option value="6">Jun</option>
						<option value="7">Jul</option>
						<option value="8">Aug</option>
						<option value="9">Sep</option>
						<option value="10">Oct</option>
						<option value="11">Nov</option>
						<option value="12">Dec</option>
					</select>
				</td>
				<td>
					<select name="year" id="y"  class="styledselect-year">
						<option value="">Year</option>
                        <?php for($i= $currentYear -65; $i<$currentYear-15; ++$i){ ?>
							<option value="<?php echo $i ?>"><?php echo $i ?></option>
                        <?php }?>						
					</select>                    
				</td>
				<td><a href="javascript:"  id="date-pick"><img src="images/forms/calendar.png"   alt="" /></a></td>
			</tr>
            <tr>
            	<td>
                	<input type="submit" value="Submit" />
                </td>
            </tr>
			</table>
</form>          
            <script type="text/javascript" charset="utf-8">
        	
		$(function()
{
	
// initialise the "Select date" link
$('#date-pick')
	.datePicker(
		// associate the link with a date picker
		{
			createButton:false,
			startDate:<?php echo '"'.$beginDate.'"'; ?>,//'01/01/1900',			
			endDate:<?php echo '"'.$endDate.'"'; ?>//'31/12/2020'
		}
	).bind(
		// when the link is clicked display the date picker
		'click',
		function()
		{
			updateSelects($(this).dpGetSelected()[0]);
			$(this).dpDisplay();
			return false;
		}
	).bind(
		// when a date is selected update the SELECTs
		'dateSelected',
		function(e, selectedDate, $td, state)
		{
			updateSelects(selectedDate);
		}
	).bind(
		'dpClosed',
		function(e, selected)
		{
			updateSelects(selected[0]);
		}
	);
	
var updateSelects = function (selectedDate)
{
	var selectedDate = new Date(selectedDate);
	$('#d option[value=' + selectedDate.getDate() + ']').attr('selected', 'selected');
	$('#m option[value=' + (selectedDate.getMonth()+1) + ']').attr('selected', 'selected');
	$('#y option[value=' + (selectedDate.getFullYear()) + ']').attr('selected', 'selected');
}
// listen for when the selects are changed and update the picker
$('#d, #m, #y')
	.bind(
		'change',
		function()
		{			
			var d = new Date(
						$('#y').val(),
						$('#m').val()-1,
						$('#d').val()
					);
			$('#date-pick').dpSetSelected(d.asString());
		}
	);

// default the position of the selects to today
var today = new Date();
var beginday = new Date(<?php echo "'".$beginDate2."'"; ?>);
updateSelects(beginday.getTime()  );
// and update the datePicker to reflect it...
$('#d').trigger('change');
});
</script>
</body>


</html>